1. Be able to write & deploy shiny apps

2. Have a broad understanding of what shiny’s capabilities

3. Be familiar with popular interactive data viz frameworks and know how to render them

4. help for self-help

Requirement for 1 ECTS point:

• write your own shiny app or flexdashboard and present it in session II

• First Session

  • Introduction to Shiny

  • Shiny handson examples & exercises

  • Discuss presentations

• Second Session

  • RMarkdown, interactive visualisation and dashboards

    • Highcharts, Plotly & ggplot

  • Peek into advanced appliances

    • Upgrade with HTML, CSS, JS

  • Presentations

  • Further pointers

Shiny tutorials by RStudio - Videos and written tutorials to basic functionalities of shiny

Mastering Shiny Build interactive Apps, Reports & Dashboards Powered by R

• Very good guide for basic & advanced mechanics of shiny by Hadley Wickham (Tidyverse Guy)

Shiny cheatsheet, available from https://www.rstudio.com/resources/cheatsheets/

Shiny is a framework for creating web applications using R code. It is designed primarily with data scientists in mind, and to that end, you can create pretty complicated Shiny apps with no knowledge of HTML, CSS, or JavaScript. On the other hand, Shiny doesn’t limit you to creating trivial or prefabricated apps: its user interface components can be easily customized or extended, and its server uses reactive programming to let you create any type of back end logic you want. Shiny is designed to feel almost magically easy when you’re getting started, and yet the deeper you get into how it works, the more you realize it’s built out of general building blocks that have strong software engineering principles behind them.

• Hadley Wickham

• Package for creating web-apps

library(shiny)

• Gives you easy Framework for deploying interactive R Code to everbody, without learning any other language than R

  • you write the R code and shiny creates the app

  • But if you know some HTML,CSS or JS you can easily utilize this. (easy to learn anyway)

  • interactive app, that takes inputs from the user and updates the outputs accordingly

• Every shiny app consists of two components

  • Userinterface (UI) = The body of your app
  • Server => The brain of your app

https://shiny.rstudio.com/gallery/

library(shiny)

ui <- fluidPage(
  "Hello, world!"
)

server <- function(input, output, session) {
}

shinyApp(ui, server)

## 
## Listening on http://127.0.0.1:8784

UI: Layout

User interface (front end) - Controls layout and appearance of your app - placing and displaying - inputs(e.g. scroll bars, buttons, text input) and - outputs (e.g. plot, text)

We basically create an HTML document with r syntax. Example:

library(shiny)
ui <- fluidPage(
  "Hello, world!"
)

message(ui)

## <div class="container-fluid">Hello, world!</div>

Provides high-level visual structure

Hierarchy of function calls (Waterfall principle + nested)

fluidPage(), fixedPage() or fillPage() —> provides basic HTML and CSS structure (think of it like a skeleton)

More complex customization need “Layout functions” and are nested inside fluidpage

Structure of a basic app with sidebar

library(shiny)
library(bslib)


ui <- fluidPage( theme =  bs_theme(version = 4, bootswatch = "cosmo"),
  titlePanel("This is the title panel"),

  sidebarLayout(
    sidebarPanel( "Ths is the sidebar panel"),
    mainPanel("And this is the main panel...")
  )
)
ui

Shinywidgets collect a value from your user. When a user changes the widget, the value will change as well. You can find more information here.

Server functions include everything you would normally to do your analysis, but include reactives.

• code your analysis

• connect code to your UI via reactive functions

Reactive functions are something between variables (cold/static) and a function (hot/dynamic) => a function with memory.

First time called: run like a function Second time called: read from cache (if nothing changed)

Example:

library(shiny)
dataset <- reactive({ data(mtcars) })
print(dataset)

## reactive({
##     data(mtcars)
## })

dataset()  # notice, that dataset is now a function

Reactives are the magic sprinkles, that deal with the communication between the UI and the Server. Web developers call this concept “callback”. Usually a tedious experience, but shiny manages this almost automatically for you. This is the major USP of shiny (taking care of the dependencies).

Creating a reactive output requires two components. First an output function placed in the UI, and second a render function written in the server function.

library(shiny)

# Define UI for app that takes input and output ----
ui <-  fluidPage(

      # Input: textinput ----
      textInput(inputId = "firstName",
                placeholder = "Type your name",
                label = "What's your name?"
                ),

      # Output: Text ----
      textOutput(outputId = "text")

)


# Define server logic required to draw a histogram ----
server <- function(input, output) {
  
textReactive  <-  eventReactive(input$firstName,
                {paste("Hello", input$firstName, "!")},
                ignoreInit = TRUE)
  
  output$text <- renderText({
        textReactive()
    })

}

# Create Shiny app ----
shinyApp(ui = ui, server = server)

Bootstrap is a collection of HTML Conventions, CSS Styles, & JavaScript Snippets provided in a convenient form

• originally developed by Twitter, but a popular CSS Frameworks

• also used in R-Package Websites or R Markdown converted HTML

• generated automatically by Shiny - takes HTML Arguments (class, etc. ) in UI

• highly customizable like any website - use themes provided by bs_theme (we’ll look at this later)

• Make your life easier with bslib

  • functions for easy changes in style + an interactive styling app w/ code generator
  • try following package for an interactive (shiny bases) bootstrap customizer

    library(bslib)
    bs_theme_preview( bs_theme())  # check the console for the generated code

• it’s possible to use other frameworks than bootstrap

  • see nanxstats/awesome-shiny-extensions for an extensive collection of helpful packages for all kind of topics

1. Go to https://www.shinyapps.io and create an account or log in with Google/GitHub

2. Follow the instructions for connecting your machine to the server.

3. Publish!

• Most popular and best documented frameworks are Plotly, Highcharts, leaflet (and d3)

  • all of them are based in JavaScript (JS).
  • luckily you don’t need to know JS, as customizing is mostly done in wrappers for various languages (R, Python, …)
  • interactivity can only be achieved, where you can run JS (web browser) . That’s why HTML documents is the gold standard

• There are a few ways to share your work - Save your Work as a HTML document (share the doc or embed it in your website). - write in a RMD document and then render to ioslides or slidy (creates also an HTML document; share or embed) - write a shiny app (deploy to shinyclouds or own server)

• frequently used frameworks:

• Plotly is the most popular and easiest to work with.

• Highcharts is less known, relatively customizable and free to use in non commercial settings

• leaflet is great for interactive maps

eventReactive minimize dependencies Render –> for looks/output observe –> for sideffects( downloadhandler, read data from disc, ….)

observeEvent = observe({x, isolate(y)}) decouples from listening to action

• shinydashboard Maintained by RStudio Developers Team. Well suited for shiny apps.

  • written as shiny app

  library(shiny)
  library(shinydashboard)
  library(shinydashboardPlus) # bonus features. 

• flexdashboard if you only want to run RMD Documents or if you want to mix content like this dashboard. But its also possible to run shiny by adding runtime: shiny to YAML

  • written in a RMD document

  -------------------------------------------
  title: "Interactive Data Vizualisations"
  runtime: shiny
  -------------------------------------------

1. Go to https://www.shinyapps.io and create an account or log in with Google/GitHub

2. Follow the instructions for connecting your machine to the server.

3. Publish!

ShinyWidgets

• Once you are familiar with Shiny it’s easy to reuse your know how to create interactive helper for R https://shiny.rstudio.com/articles/gadgets.html

• Harvard Lecture on YouTube, check out the first lecture for a good introduction to those topics.

• Some Android apps to learn HTML, CSS, JavaScript

  • https://play.google.com/store/apps/details?id=com.codeliber.html
  • https://play.google.com/store/apps/details?id=com.codeliber.css
  • https://play.google.com/store/apps/details?id=com.codeliber.js

R Markdown Cookbook Book Plotly for R ## other Interactive Data Visualization Frameworks

• Dash R, a plotly based App with inputs and output (similar to shiny, but less powerful)
• Voilà turns Jupyter notebooks into standalone applications.
• streamlit
• D3 for R, extremely customizable data visualizations, but also very timeconsuming